﻿<!DOCTYPE html>
<html lang="en" style="font-size: 49.8667px">

<head>
  <meta charset="UTF-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <meta name="viewport" content="initial-scale=1, width=device-width, maximum-scale=1, user-scalable=no" />
  <title></title>
  <link rel="stylesheet" href="../css/index.css" />
  <link rel="stylesheet" href="../css/common.css" />
  <link rel="stylesheet" href="../css/base.css?v=082201" />
  <link rel="stylesheet" href="../css/van.css" />
  <link rel="stylesheet" href="../css/fonts/iconfont.css" />
  <link rel="stylesheet" href="../font-awesome/css/font-awesome.min.css" />
  <link rel="stylesheet" href="../css/font.css" />
  <link rel="stylesheet" href="../css/swiper-bundle.min.css" />
  <link rel="stylesheet" href="./css/default.css?v=120301" />
  <link rel="stylesheet" href="../css/verify.css?v=221117" />
</head>

<body>
  <noscript>
    <strong>很抱歉，如果不启用JavaScript，则无法正常工作。请使其继续。</strong>
  </noscript>
  <div id="app">
    <!-- 是否展示公告 -->
    <div class="notice_outer" v-if="!showPlayerInfo && actData.showNotice">
      <van-notice-bar left-icon="volume-o" scrollable :text="actData.notice"></van-notice-bar>
    </div>
    <!-- 标题 -->
    <van-nav-bar v-if="showPlayerInfo" :title="playerInfo.name" left-text="返回" left-arrow @click-left="onNavBack">
    </van-nav-bar>
    <!-- 底部的tabbar -->
    <van-tabbar v-model="tabBarItem" class="tabbar" @change="onTabbarChange">
      <van-tabbar-item v-for="(item, index) in tabBarItems" :name="item.key"
        :class="tabBarItem == item.key ? primaryColor : ''" v-if="item.show" :key="index" :icon="item.icon">
        {{item.title}}
      </van-tabbar-item>
    </van-tabbar>
    <!-- 轮播图容器 -->
    <div class="swiper-container" id="swiper">
      <div class="swiper-wrapper"></div>
    </div>
    <!-- 投票信息 -->
    <div class="container" v-if="!showPlayerInfo">
      <div class="topheader">
        <div :class="'vote_info ' + primaryBg">
          <div>
            <span>{{actData.playerCount}}</span>
            <div>已报名</div>
          </div>
          <div>
            <span>{{actData.tickets}}</span>
            <div>总{{actData.tickUnit}}数</div>
          </div>
          <div>
            <span>{{actData.viewNum}}</span>
            <div>浏览量</div>
          </div>
        </div>
        <!-- 投票时间区间 -->
        <p class="time_box">
          <span v-if="!actOver">
            <i class="Ticonfont iconH5_shouye_huodongxinxi_shijian" style="color: rgb(82, 130, 240)"></i>
            结束倒计时
            <span>{{countObj.day}}</span>
            天
            <span>{{countObj.hour}}</span>
            时
            <span>{{countObj.minute}}</span>
            分
            <span>{{countObj.second}}</span>
            秒
          </span>
          <span v-if="actOver">活动已结束</span>
        </p>
      </div>
    </div>
    <!-- 活动开始到接受，或者活动介绍 -->
    <div class="container" v-if="!showPlayerInfo">
      <div class="outline_box">
        <div class="introducebox">
          <div class="time flex_row">
            <i class="Ticonfont iconH5_shouye_huodongxinxi_shijian flex_grow_0" style="color: rgb(82, 130, 240)"></i>
            <span class="flex_grow_0">活动开始:</span>
            <span class="flex_grow_1">{{fromTimestamp(actData.startTime)}}</span>
          </div>
          <div class="time flex_row">
            <i class="Ticonfont iconshijian1 flex_grow_0" style="color: rgb(82, 130, 240)"></i>
            <span class="flex_grow_0">活动结束:</span>
            <span class="flex_grow_1">{{fromTimestamp(actData.endTime)}}</span>
          </div>
          <div class="time flex_row" v-if="pageIndex != 4">
            <i class="Ticonfont iconH5_shouye_huodongxinxi_shijian flex_grow_0" style="color: rgb(82, 130, 240)"></i>
            <span class="flex_grow_0">{{actData.btnText}}时段:</span>
            <span class="flex_grow_1">{{formatTime(actData.voteStart)}} 至 {{formatTime(actData.voteEnd)}}</span>
          </div>
          <div class="time flex_row" v-if="pageIndex == 4">
            <i class="Ticonfont iconH5_shouye_huodongxinxi_shijian flex_grow_0" style="color: rgb(82, 130, 240)"></i>
            <span class="flex_grow_0">报名开始:</span>
            <span class="flex_grow_1">{{fromTimestamp(actData.enroll.startTime)}}</span>
          </div>
          <div class="time flex_row" v-if="pageIndex == 4">
            <i class="Ticonfont iconshijian1 flex_grow_0" style="color: rgb(82, 130, 240)"></i>
            <span class="flex_grow_0">报名结束:</span>
            <span class="flex_grow_1">{{fromTimestamp(actData.enroll.endTime)}}</span>
          </div>

          <div class="time flex_row">
            <i class="Ticonfont iconjinggao flex_grow_0" style="color: rgb(82, 130, 240)"></i>
            <span class="flex_grow_0">活动规则:</span>
            <span class="flex_grow_1">{{actData.ruleText}}</span>
          </div>



          <div class="time flex_y_center" v-if="showIntro && actData.shareId !='K0ivv1' && actData.shareId !='P0OmPO' && actData.shareId !='TOaj9S'  && actData.shareId !='bbzn5G' && actData.shareId !='P40Oy1' ">
            <i class="Ticonfont iconH5_shouye_huodongxinxi_jieshao flex_grow_0" style="color: rgb(82, 130, 240)"></i>
              <span class="flex_grow_0">活动介绍:</span>
              <div class="flex_grow_1 flex_y_center" @click="doOpenIntro">
                {{openIntroText}}
                <i
                  :class="actData.openIntro ? 'Ticonfont  iconH5_shouye_huodongxinxi_shouqi' : 'Ticonfont iconH5_shouye_huodongxinxi_zhankai'"></i>
              </div>                   
          </div>


          <!-- <div class="time flex_row" v-if="showIntro && (actData.shareId =='K0ivv1' || actData.shareId =='P0OmPO' || actData.shareId =='TOaj9S'  || actData.shareId =='bbzn5G' || actData.shareId =='P40Oy1'  ) "> -->
            <div class="time flex_row" v-if="showIntro && ['K0ivv1','P0OmPO','TOaj9S','bbzn5G','P40Oy1'].includes(actData.shareId)">
            <i class="Ticonfont iconH5_shouye_huodongxinxi_jieshao flex_grow_0" style="color: rgb(82, 130, 240)"></i>
              <!-- <span class="flex_grow_0">活动原则:&nbsp;&nbsp;{{actData.intro}}</span> -->
              <span class="flex_grow_0">活动原则:</span>
              <span class="flex_grow_1">{{actData.intro}}</span>                      
          </div>


          <div v-if=" ['K0ivv1','P0OmPO','TOaj9S','bbzn5G','P40Oy1'].includes(actData.shareId)">
            <!-- <div class="shuoming_con"   v-html="actData.intro"></div> -->
          </div>
          <div v-else>
            <div class="shuoming_con" v-if="actData.openIntro && showIntro" v-html="actData.intro"></div>
          </div>
          <!-- 展示在线报名按钮 -->
          <van-button type="info" icon="records" :class="primaryBg" v-if="showIntro && actData.canEnroll" size="small"
            @click="onTabbarChange('signup')">在线报名</van-button>
        </div>
      </div>
    </div>
    <!-- 搜索选手 -->
    <div class="container" v-if="showSearch">
      <div class="search flex_y_center">
        <input type="text" :placeholder="'请输入' + actData.playerCall + '编号/名称'" v-model="searchKey"
          class="flex_grow_1" />
        <div :class="'search_btn flex_center flex_grow_0 ' + primaryBg" @click="onSearch">
          <i class="Ticonfont iconH5_dibuTAB_sousuo"></i>
          搜索
        </div>
      </div>
    </div>
    <div v-if="!showPlayerInfo">
      <!-- 选手分组 -->
      <div class="container" v-if="actData.showGroup && pageIndex==1">
        <div class="player_group">
          <van-grid :border="false" :gutter="10" :column-num="actData.groupCols">
            <van-grid-item v-if="actData.shareId != 'P40iDO' && actData.shareId != 'KaHOKC'">
              <van-button :type="!curGroup ? 'info' : 'default'" :class="!curGroup ? primaryBg : ''" size="mini"
                @click="loadGroupPlayer(null)">全部</van-button>
            </van-grid-item>
            <van-grid-item v-for="(group, index) in actData.groups" :key="index">
              <van-button :type="curGroup == group ? 'info' : 'default'" size="mini"
                :class="curGroup == group ? primaryBg : ''" @click="loadGroupPlayer(group)">{{group.name}}</van-button>
            </van-grid-item>
          </van-grid>
          <van-grid style="margin-top: 0.2rem" :border="false" :gutter="10" :column-num="actData.groupCols"
            v-if="curGroup && curGroup.subGroups">
            <van-grid-item>
              <van-button :type="!subGroup ? 'info' : 'default'" size="mini" :class="!subGroup ? primaryBg : ''"
                @click="loadGroupPlayer(curGroup,null)">全部</van-button>
            </van-grid-item>
            <van-grid-item v-for="(group, index) in curGroup.subGroups" :key="index">
              <van-button :type="subGroup == group ? 'info' : 'default'" size="mini"
                :class="subGroup == group ? primaryBg : ''" @click="loadGroupPlayer(curGroup, group)">{{group.name}}
              </van-button>
            </van-grid-item>
          </van-grid>
          <van-grid style="margin-top: 0.2rem" :border="false" :gutter="10" :column-num="actData.groupCols"
            v-if="subGroup && subGroup.subGroups">
            <van-grid-item>
              <van-button :type="!thirdGroup ? 'info' : 'default'" size="mini" :class="!thirdGroup ? primaryBg : ''"
                @click="loadGroupPlayer(curGroup,subGroup)">全部</van-button>
            </van-grid-item>
            <van-grid-item v-for="(group, index) in subGroup.subGroups" :key="index">
              <van-button :type="thirdGroup == group ? 'info' : 'default'" size="mini"
                :class="thirdGroup == group ? primaryBg : ''" @click="loadGroupPlayer(curGroup, subGroup, group)">
                {{group.name}}
              </van-button>
            </van-grid-item>
          </van-grid>
        </div>
      </div>
      <div class="container" :key="1" style="box-sizing: border-box; position: relative" v-show="pageIndex==1">
        <!-- 判断瀑布流 -->
        <!-- <div :class="actData.showType==1 ? 'grid_waterfall':`player_list col${actData.palyerCol}`"> -->
          <div class="player_list zuoyou col1" v-if="actData.palyerCol==1&&actData.singleCol==1" key="100">
            <div class="player_item grid_item" v-for="(item, index) in players" :key="index">
              <div class="player_photo" @click="getPlayerInfo(item.id)">
                <p class="player_no">
                  <i :class="'Ticonfont iconH5_shouye_xuanshou_tupian_jiaobiao ' + primaryColor"></i>
                  {{item.serial}}号
                </p>
                <div class="imgbox">
                  <!-- <van-image :src="item.cover" :lazy-load="true" v-if="item.cover"></van-image>
                  <iframe v-if="item.video && !item.cover" :src="item.video" scrolling="no" frameborder="no"
                    framespacing="0" allowfullscreen="true"></iframe> -->
                    <video v-if="item.video && item.video.indexOf('jdytp.com')>-1" :src="item.video" :poster="item.cover" preload="none" controls></video>
                    <iframe v-else-if="item.video" :src="item.video" scrolling="no" frameborder="no" framespacing="0" allowfullscreen="true"></iframe>
                    <van-image :src="item.cover" :lazy-load="true" v-else-if="item.cover"></van-image>
                </div>
              </div>
              <div class="player_box">
              <div class="player_name">{{item.name}}</div>
              <div class="player_subname" v-if="item.subTitle">{{item.subTitle}}</div>
              <div class="player_vote">
                <span>{{item.ticket}}</span>
                {{actData.tickUnit}}
              </div>
              <van-button size="small" :class="'toupiao_btn ' + primaryBg" @click="vote(item.id)" style="width: 70% !important;">{{actData.rule.multi ?
                (item.select ? unselText : selText) : actData.btnText}}</van-button>
              <van-button size="small" :class="'info_btn ' + primaryColor + ' ' + primaryBorder"
                @click="getPlayerInfo(item.id)" v-if="actData.showPlayerInfo" style="width: 70% !important;">详情</van-button>
            </div>
          </div> 
        </div>
          <div :class="actData.showType==1 ? 'grid_waterfall':`player_list col${actData.palyerCol}`" :key="actData.showType" v-else>
          <div class="player_item grid_item" v-for="(item, index) in players" :key="index">
            <div class="player_photo" @click="getPlayerInfo(item.id)">
              <p class="player_no">
                <i :class="'Ticonfont iconH5_shouye_xuanshou_tupian_jiaobiao ' + primaryColor"></i>
                {{item.serial}}号
              </p>
              <div class="imgbox">
                <!-- <van-image :src="item.cover" :lazy-load="true" v-if="item.cover"></van-image>
                <iframe v-if="item.video && !item.cover" :src="item.video" scrolling="no" frameborder="no"
                  framespacing="0" allowfullscreen="true"></iframe> -->
                  <video v-if="item.video && item.video.indexOf('jdytp.com')>-1" :src="item.video" :poster="item.cover" preload="none" controls></video>
                  <iframe v-else-if="item.video" :src="item.video" scrolling="no" frameborder="no" framespacing="0" allowfullscreen="true"></iframe>
                  <van-image :src="item.cover" :lazy-load="true" v-else-if="item.cover"></van-image>
              </div>
            </div>
            <div class="player_name">{{item.name}}</div>
            <div class="player_subname" v-if="item.subTitle">{{item.subTitle}}</div>
            <div class="player_vote">
              <span>{{item.ticket}}</span>
              {{actData.tickUnit}}
            </div>
            <van-button size="small" :class="'toupiao_btn ' + primaryBg" @click="vote(item.id)">{{actData.rule.multi ?
              (item.select ? unselText : selText) : actData.btnText}}</van-button>
            <van-button size="small" :class="'info_btn ' + primaryColor + ' ' + primaryBorder"
              @click="getPlayerInfo(item.id)" v-if="actData.showPlayerInfo">详情</van-button>
          </div>
       
      </div>

      </div>
      <!-- tabbar介绍页面展示 -->
      <div class="container" key="2" v-if="pageIndex==2">
        <div :class="'title ' + primaryBg">活动介绍</div>
        <div class="intro" v-html="actData.intro"></div>
      </div>
      <!-- tabbar排名页面展示而且要展示分组信息的 -->
      <div class="container" v-if="actData.showGroup && pageIndex==3">
        <div class="player_group">
          <van-grid :border="false" :gutter="10" :column-num="actData.groupCols">
            <van-grid-item v-if="actData.shareId != 'P40iDO' && actData.shareId != 'KaHOKC'">
              <van-button :type="!rankGroup1 ? 'info' : 'default'" :class="!rankGroup1 ? primaryBg : ''" size="mini"
                @click="rankGroup1=null,rankGroup2=null,rankGroup3=null,setRankPlayers(0)">
                全部
              </van-button>
            </van-grid-item>
            <van-grid-item v-for="(group, index) in actData.groups" :key="index">
              <van-button :type="rankGroup1 == group ? 'info' : 'default'" size="mini"
                :class="rankGroup1 == group ? primaryBg : ''"
                @click="rankGroup1=group,rankGroup2=null,rankGroup3=null,setRankPlayers(group.id)">
                {{group.name}}
              </van-button>
            </van-grid-item>
          </van-grid>
          <van-grid style="margin-top: 0.2rem" :border="false" :gutter="10" :column-num="actData.groupCols"
            v-if="rankGroup1 && rankGroup1.subGroups">
            <van-grid-item>
              <van-button :type="!rankGroup2 ? 'info' : 'default'" size="mini" :class="!rankGroup2 ? primaryBg : ''"
                @click="rankGroup2=null, rankGroup3=null,setRankPlayers(rankGroup1.id)">
                全部
              </van-button>
            </van-grid-item>
            <van-grid-item v-for="(group, index) in rankGroup1.subGroups" :key="index">
              <van-button :type="rankGroup2 == group ? 'info' : 'default'" size="mini"
                :class="rankGroup2 == group ? primaryBg : ''"
                @click="rankGroup2=group,rankGroup3=null,setRankPlayers(group.id)">
                {{group.name}}
              </van-button>
            </van-grid-item>
          </van-grid>
          <van-grid style="margin-top: 0.2rem" :border="false" :gutter="10" :column-num="actData.groupCols"
            v-if="rankGroup2 && rankGroup2.subGroups">
            <van-grid-item>
              <van-button :type="!rankGroup3 ? 'info' : 'default'" size="mini" :class="!rankGroup3 ? primaryBg : ''"
                @click="rankGroup3=null,setRankPlayers(rankGroup2.id)">全部</van-button>
            </van-grid-item>
            <van-grid-item v-for="(group, index) in rankGroup2.subGroups" :key="index">
              <van-button :type="rankGroup3 == group ? 'info' : 'default'" size="mini"
                :class="rankGroup3 == group ? primaryBg : ''" @click="rankGroup3=group,setRankPlayers(group.id)">
                {{group.name}}
              </van-button>
            </van-grid-item>
          </van-grid>
        </div>
      </div>
      <!-- 排名页面展示 -->
      <div class="container" key="3" v-if="pageIndex==3">
        <div :class="'title' + primaryBg">
          <ul class="flex_y_center flex_between">
            <li>排名</li>
            <li>参与{{actData.playerCall}}</li>
            <li>{{actData.tickUnit}}数</li>
          </ul>
        </div>
        <div class="rank_box">
          <ul class="rank_list">
            <li v-for="(item, index) in rankPlayers" :key="index">
              <div class="rank_item">
                <div :class="'rank_num flex_grow_0 num_' + (index+1)"><span>{{index+1}}</span></div>
                <div class="rank_face flex_grow_0">
                  <van-image :src="item.cover" :lazy-load="true" v-if="item.cover"></van-image>
                </div>
                <div class="rank_name flex_grow_1">
                  {{item.serial}}号
                  <p>{{item.name}}</p>
                  <p v-if="item.subTitle">{{item.subTitle}}</p>
                </div>
                <div :class="'rank_vote flex_grow_0 ' + primaryColor">{{item.ticket}}</div>
              </div>
            </li>
          </ul>
        </div>
      </div>
      <div class="container" v-if="pageIndex == 4">
        <!--在线报名-->
        <div :class="'title ' + primaryBg">在线报名</div>
        <div class="rank_box">
          <div class="sign_list">
            <van-form @submit="onSignup">
              <van-field v-model="enrollObj.name" name="name" required :label="actData.enroll.playerNameTitle"
                :placeholder="actData.enroll.playerNameTitle"
                :rules="[{ required: true, message: '请填写' + actData.enroll.playerNameTitle  }]"></van-field>

              <van-field v-if="actData.enroll.playerPhone>0" :required="actData.enroll.playerPhone==1" type="tel"
                v-model="enrollObj.phone" name="phone" :label="actData.enroll.playerPhoneTitle"
                :placeholder="actData.enroll.playerPhoneTitle"
                :rules="[{ required: actData.enroll.playerPhone == 1, message: '请填写' + actData.enroll.playerPhoneTitle }]">
              </van-field>

              <van-field v-if="actData.groups && actData.groups.length > 0" :required="true" label="分组"
                v-model="showGroupLabel" placeholder="请选择所属分组" @click="showPopGroup=true"></van-field>
              <van-popup v-model="showPopGroup" round position="bottom">
                <van-cascader v-model="enrollObj.group" title="请选择分组" @finish="selGroupDone" @close="showPopGroup=false"
                  :options="actData.groups" :field-names="groupFields"></van-cascader>
              </van-popup>

              <div class="van-cell van-field" v-if="actData.enroll.playerPhoto>0">
                <div
                  :class="actData.enroll.playerPhoto==1 ? 'van-cell__title van-field__label van-cell--required' : 'van-cell__title van-field__label'">
                  <span>{{actData.enroll.playerPhotoTitle}}</span>
                </div>
                <div class="van-field__body">
                  <div class="imgbox van-uploader">
                    <div class="van-uploader__wrapper">
                      <div class="van-uploader__preview" v-for="(item,index) in photoList" :key="index">
                        <div class="van-image van-uploader__preview-image">
                          <img :src="item.url" class="van-image__img" style="object-fit: cover" />
                        </div>
                        <div class="van-uploader__preview-delete" @click="delPhoto(item)">
                          <i class="van-icon van-icon-cross van-uploader__preview-delete-icon"></i>
                        </div>
                      </div>
                      <div class="van-uploader__upload" v-if="photoList.length < actData.enroll.playerPhotoMax"
                        @click="uploadOneFile">
                        <i class="van-icon van-icon-photograph van-uploader__upload-icon"></i>
                      </div>
                    </div>
                  </div>
                </div>
              </div>

              <div class="van-cell van-field" v-if="actData.enroll.playerAudio>0">
                <div
                  :class="actData.enroll.playerAudio==1 ? 'van-cell__title van-field__label van-cell--required' : 'van-cell__title van-field__label'">
                  <span>{{actData.enroll.playerAudioTitle}}</span>
                </div>
                <div class="van-field__body">
                  <div style="display: block">
                    <div class="radio_group">
                      <div :class="musicType==1 ? 'radio_item radio_check ' + primaryBg : 'radio_item'"
                        @click="changeAudioType(1)">本地音频</div>
                      <div :class="musicType==2 ?'radio_item radio_check ' + primaryBg : 'radio_item'"
                        @click="changeAudioType(2)">网络音频</div>
                    </div>
                    <div v-if="musicType==2">
                      <input type="text" class="input" v-model="enrollObj.audio" placeholder="请输入音频URL地址" />
                    </div>
                    <van-uploader v-if="musicType==1" accept=".mp3" v-model="audioList" :before-read="uploadAudioCheck"
                      :after-read="uploadOneFile('audio')">
                      <van-button icon="music" :class="primaryBg" type="info" size="small">上传本地音频</van-button>
                    </van-uploader>

                    <!-- <input type="text" class="input" v-model="enrollObj.audio" placeholder="请输入音频URL地址" /> -->
                  </div>
                </div>
              </div>

              <div class="van-cell van-field" v-if="actData.enroll.playerVideo>0">
                <div
                  :class="actData.enroll.playerVideo==1 ? 'van-cell__title van-field__label van-cell--required' : 'van-cell__title van-field__label'">
                  <span>{{actData.enroll.playerVideoTitle}}</span>
                </div>
                <div class="van-field__body">
                  <div class="display:block">
                    <div class="radio_group">
                      <div :class="videoType==1 ? 'radio_item radio_check ' + primaryBg : 'radio_item'"
                        @click="changeVideoType(1)">本地视频</div>
                      <div :class="videoType==2 ?'radio_item radio_check ' + primaryBg : 'radio_item'"
                        @click="changeVideoType(2)">网络视频</div>
                    </div>
                    <div v-if="videoType==2">
                      <input type="text" class="input" v-model="enrollObj.video" placeholder="请输入腾讯视频或哔哩哔哩视频URL地址" />
                    </div>
                    <van-uploader v-if="videoType==1" accept=".mp4" v-model="videoList" :before-read="uploadVideoCheck"
                      ::after-read="uploadOneFile('video')">
                      <van-button icon="video" :class="primaryBg" type="info" size="small">上传本地视频</van-button>
                    </van-uploader>

                    <!-- <input type="text" class="input" v-model="enrollObj.video" placeholder="请输入腾讯视频或哔哩哔哩视频URL地址" /> -->
                  </div>
                </div>
              </div>

              <div class="info_box" v-if="actData.enroll.playerInfo>0">
                <div class="info_title">
                  <span class="req_field" v-if="actData.enroll.playerInfo==1">*</span>
                  {{actData.enroll.playerInfoTitle}}
                </div>
                <div class="info_editor">
                  <vue-html5-editor :content="enrollObj.info" @change="updateInfo" :height="300" :z-index="1000"
                    :auto-height="true"></vue-html5-editor>
                </div>
              </div>

              <van-field v-for="(item, index) in actData.enroll.items" :required="item.type==1" :key="index"
                v-model="item.value" :name="'item_' + index" :label="item.name" :placeholder="item.name"
                :rules="[{required: item.type==1, message: '请填写' + item.name}]"></van-field>

              <van-button block type="info" size="small" :class="primaryBg" native-type="submit">提交</van-button>
            </van-form>
          </div>
        </div>
      </div>
    </div>
    <div v-if="showPlayerInfo">
      <div class="container">
        <div v-if="actData.shareId=='LKSq9G'">
          <div class="player_title" style="color:#fff;">{{playerInfo.serial}}号 {{playerInfo.name}}</div>
          <div class="player_subtitle" style="color:#fff;" v-if="playerInfo.subTitle">{{playerInfo.subTitle}}</div>
        </div>
        <div v-else>
          <div class="player_title">{{playerInfo.serial}}号 {{playerInfo.name}}</div>
          <div class="player_subtitle" v-if="playerInfo.subTitle">{{playerInfo.subTitle}}</div>
        </div>
        <div class="topheader">
          <div :class="'vote_info ' + primaryBg">
            <div>
              <span>{{playerInfo.ranking}}</span>
              <div>排名</div>
            </div>
            <div>
              <span>{{playerInfo.ticket}}</span>
              <div>{{actData.tickUnit}}数</div>
            </div>
            <div>
              <span>{{playerInfo.disparity}}</span>
              {{actData.tickUnit}}
              <div>距上一名</div>
            </div>
          </div>
        </div>
      </div>
      <div class="container" v-if="playerInfo.audio">
        <div :class="'title ' + primaryBg">{{actData.playerCall}}音频</div>
        <div class="playbox">
          <audio controls id="playerAudioPlay"></audio>
        </div>
      </div>
      <div class="container" v-if="playerInfo.video">
        <div :class="'title ' + primaryBg">{{actData.playerCall}}视频</div>
        <div class="playbox">
          <video :src="playerInfo.video" id="playerVideoPlay" controls class="videoplayer"></video>
        </div>
      </div>
      <div class="container">
        <div :class="'title ' + primaryBg" v-if="playerInfo.info != '' && playerInfo.info != null" >{{actData.shareId == 'T0aPqT' ? '候选人事迹材料' : (actData.playerCall + '介绍')}}
        </div>
        <div class="intro">
          <div v-html="playerInfo.info" v-if="playerInfo.info != '' && playerInfo.info != null" ></div>
          <div class="btns">
            <van-button type="info" :class="primaryBg" @click="vote(playerInfo.id)">{{actData.rule.multi ?
              (playerInfo.select ? unselText : selText) : actData.btnText}}</van-button>
            <van-button type="info" :class="primaryBg" @click="makePoster(true)" v-if="actData.shareId != 'T0aPqT'">为我拉票
            </van-button>
          </div>
        </div>
      </div>
      <!-- 评论 -->
      <div class="container" v-if="actData.canReply">
        <div class="reply_title">
          <span>精彩评论</span>
          <span class="sub_reply" @click="addReply">发表评论</span>
        </div>
        <ul class="reply_list">
          <li v-for="(item, index) in replyList" :key="index">
            <div class="reply_item">
              <div class="reply_name">
                <img :src="item.face" />
                <p>{{item.nickName}}</p>
              </div>
              <div class="reply_content">
                <div class="content">{{item.content}}</div>
                <div class="time">发表于 {{fromTimestamp(item.addtime)}}</div>
              </div>
            </div>
          </li>
        </ul>
        <van-pagination v-model="replyPage" :total-items="replyRecordCount" :items-per-page="replySize"
          :show-page-size="5" @change="changeReplyPage" force-ellipses />
      </div>
    </div>

    <div class="container technical-support" v-if="actData.showSupport != 0">
      <span>{{actData.support}}</span>
      <div class="home-link" v-if="actData.support && actData.support.indexOf('筋斗云')>-1"><a
          :href="'https://m.jdytp.com?wyycj='+actId">我也要创建活动</a></div>
    </div>

    <div class="fullAd" v-if="actData.showOpenAd && !testMode">
      <div class="full_img" :style="'background-image:url(' + actData.openAdImage + ')'">
        <div class="tips">{{openAdSec}}秒后关闭</div>
      </div>
    </div>
    <van-dialog v-model="showReplyDlg" title="发表评论" show-cancel-button :closeOnClickOverlay="true"
      @confirm="submitReply">
      <textarea v-model="replyContent" class="replybox" placeholder="请输入评论内容，最多200字" maxlength="200"
        rows="5"></textarea>
    </van-dialog>
    <van-dialog v-model="showSearchDlg" title="搜索" show-cancel-button :closeOnClickOverlay="true" @confirm="onSearch">
      <van-search v-model="searchKey" :placeholder="'请输入' + actData.playerCall + '编号/名称'" @search="onSearch" />
    </van-dialog>
    <van-dialog v-model="showPopDlg" :title="popDlgTitle">
      <div v-if="actData.showPopAd" class="popimg">
        <a :href="actData.popAdUrl" id="popLink">
          <img :src="actData.popAdImage" id="popImg" />
        </a>
      </div>
      <p class="popmsg">{{popDlgMsg}}</p>
    </van-dialog>

    <van-dialog v-model="showPosterDlg" :show-confirm-button="false" show-cancel-button class="poster" style="width: 80%;" >
      <img :src="shareData.image" id="shareImg" style="width:100%;" />
    </van-dialog>

    <van-dialog v-model="showCustomImgDlg" :show-confirm-button="false" show-cancel-button class="poster" style="width: 80%;">
      <img  src="" id="customImg"  style="width:100%;"  />
    </van-dialog>

    <van-dialog v-model="showAuthDlg_1" show-cancel-button @confirm="confirmAuth" class="authdlg">
      <van-field v-model="voteAuthCode" name="图形验证码" label="图形验证码" maxlength="6" placeholder="请填写图形验证码"
        :rules="[{ required: true, message: '请填写图形验证码' }]"></van-field>
      <img src="" id="authimg" @click="refreshAuth" />
    </van-dialog>

    <div class="btnposter" @click="makePoster(true)">
      生成
      <br />
      海报
    </div>

    <div class="none"></div>
    <div class="music_ctl music_stop" id="musicCtl" @click="changeMusicState"></div>

    <div id="auth_mpanel" style="margin-top:50px;"> </div>
    <div id="auth_mpanelp" style="margin-top:50px;"> </div>

    <div v-if="actData.rule.multi" class="multi_vote">
      <div class="inner">
        <div>
          <p>
            已选择
            <span class="red">{{votePlayers.length}}</span>
            个{{actData.playerCall}}，
            <span class="red" @click="cancelSelect">取消选择</span>
          </p>
          <p>
            至少选择
            <span class="red">{{actData.rule.playerMinLimit}}</span>
            个{{actData.playerCall}}，最多选择
            <span class="red">{{actData.rule.playerMaxLimit}}</span>
            个{{actData.playerCall}}
          </p>
        </div>
        <div>
          <van-button type="info" size="small" @click="multiVote">{{actData.btnText}}</van-button>
        </div>
      </div>
    </div>
  </div>
  <script src="../js/jweixin-1.6.0.js"></script>
  <script src="../js/rem.js"></script>
  <script src="../js/vue.min.js"></script>
  <script src="../js/vant.min.js"></script>
  <script src="../js/md5.min.js"></script>
  <script src="../js/swiper-bundle.min.js"></script>
  <script src="../js/jquery.min.js"></script>
  <script src="../js/snowfall.js"></script>
  <script src="../js/vue-html5-editor.js"></script>
  <script src="../js/cos-js-sdk-v5.min.js"></script>
  <script src="../js/crypto-js.js"></script>
  <script src="../js/ase.js"></script>
  <script src="../js/verify.js?v=221117"></script>
  <script src="../js/app2.js?v=221130"></script>
</body>

</html>